<template>
  <div>
    <!-- tou -->
    <van-nav-bar
      title="城市列表"
      left-arrow
      @click-left="$router.go(-1)"
      :fixed="true"
      :placeholder="true"
      :z-index="999"
    />

    <van-index-bar
      :index-list="indexList"
      highlight-color="#ee0a24"
    >
      <van-index-anchor index="#"
        >当前城市</van-index-anchor
      >
      <van-cell :title="$route.params.id" />

      <van-index-anchor index="热">热门城市</van-index-anchor>
      <van-cell
        v-for="item in remenlist"
        :key="item.value"
        :title="item.label"
        @click="dataremen(item)"
      />
      <div v-for="(item, index) in objdaxie" :key="index">
        <van-index-anchor :index="index">{{ index }}</van-index-anchor>
        <van-cell
          :title="it.label"
          v-for="(it, i) in item"
          :key="i"
          @click="datawu(it.label)"
        />
      </div>
    </van-index-bar>
  </div>
</template>

<script>
import { getcity, getremencity } from '@/api/home'
import { objdaxie, chengshilist, arrlist } from '@/api/chengshi'
import { set } from '@/utils/localStorage'
export default {
  components: {},
  props: {},
  data() {
    return {
      remenlist: [],
      objdaxie: null,
      indexList: ['#', '热', ...arrlist(65, 90)]
    }
  },
  computed: {},
  watch: {},
  async created() {
    const {
      data: { body: remen }
    } = await getremencity()
    console.log(remen)
    this.remenlist = remen
    const {
      data: { body: res1 }
    } = await getcity({ level: 1 })

    this.objdaxie = chengshilist(objdaxie(65, 90), res1)
  },
  methods: {
    datawu(name) {
      if (name === '暂无城市') {
        this.Toast('暂无城市')
      } else {
        this.Toast('暂无房源')
      }
    },
    dataremen(item) {
      set(JSON.stringify(item))
      this.$router.go(-1)
    }
  }
}
</script>

<style scoped lang="less">
::v-deep .van-index-bar__index {
  display: block;
  margin: 0px 10px 0px 0px;
  padding-left: 7px;
  padding-top: 2px;
  text-align: center;
  width: 20px;
  height: 20px;
}
::v-deep .van-index-bar__index--active {
  background: rgb(23, 160, 10);
  color: rgb(255, 255, 255) !important;
  border-radius: 50%;
}

::v-deep .van-nav-bar__content {
  background: rgb(23, 160, 10);
  z-index: 999999 !important;
  .van-nav-bar__title {
    color: rgb(255, 255, 255) !important;
  }
  .van-icon-arrow-left:before {
    color: rgb(255, 255, 255) !important;
  }
}
</style>
